<template>
  <div class="fullpayment">
    <div>
      <div class="fullpayment_title_content" flex="dir:top main:justify">
        <img @click="comeback()" class="fullpayment_title_back" src="../../assets/img/wx/mode/back.png" alt="以租代售"/>
        <headline :txt="text" :txtStyle="textStyle"></headline>
      </div>
    </div>
    <div class="sale_car_box" flex="dir:right cross:bottom">
      <img class="sale_car_bg_pic" src="../../assets/img/wx/sale/sale_car_bg.png" alt=""/>
      <img class="sale_car_pic" src="../../assets/img/wx/sale/sale_car.png" alt=""/>
    </div>
    <div class="fullpayment_plan">
      <div class="fullpayment_plan_title">
        <h3 class="fullpayment_plan_title_h3">全款方案</h3>
        <p class="fullpayment_plan_title_green_line"></p>
      </div>
      <div>
        <div class="fullpayment_plan_energy_class">
          <h4 class="energy_class_title">34.1度电</h4>
          <div>
            <img class="energy_class_green_point" src="../../assets/img/wx/about/advertise_posint.png"/>
            <span class="energy_class_content">
              建议终端销售价69800+保险5500(不含提档费,运费,不含过户费)
            </span>
          </div>
        </div>
        <div class="fullpayment_plan_energy_class">
          <h4 class="energy_class_title">34.1度电</h4>
          <div>
            <img class="energy_class_green_point" src="../../assets/img/wx/about/advertise_posint.png"/>
            <span class="energy_class_content">
              建议终端销售价69800+保险5500(-_-|含提档费,运费,不含过户费)
            </span>
          </div>
        </div>
      </div>
    </div>
  </div>
</template>

<script type="text/ecmascript-6">
  import Headline from "../mode/components/headline"
  export default {
    name: "fullpayment",
    components: {
      Headline
    },
    data() {
      return {
        text: "全款销售",
        textStyle: {
          "font-size": "21px",
          "color": "#ffffff"
        },
      }
    },
    methods: {
      comeback() {
        this.$router.back();
      }
    }
  }
</script>

<style scoped>
  .fullpayment {
    background: black;
  }

  .fullpayment_title_content {
    height: 421px;
    padding: 5vh 33px 0 33px;
  }

  .fullpayment_title_back {
    width: 59px;
    height: 59px;
  }

  .sale_car_box {
    width: 100%;
    height: 445px;
    padding-top: 110px;
  }

  .sale_car_bg_pic {
    height: 335px;
    position: absolute;
    z-index: 1;
  }

  .sale_car_pic {
    width: 374px;
    height: 257px;
    position: absolute;
    z-index: 2;
    padding-bottom: 18px;
  }

  .fullpayment_plan {
    padding: 133px 33px 185px;
  }

  .fullpayment_plan_title_h3 {
    color: white;
    font-size: 44px;
    font-weight: normal;
  }

  .fullpayment_plan_title_green_line {
    width: 84px;
    height: 1px;
    margin-top: 16px;
    background: #0B9874;
  }

  .fullpayment_plan_energy_class {
    padding-top: 59px;
  }

  .energy_class_green_point {
    width: 16px;
    height: 16px;
    float: none;
  }

  .energy_class_title {
    color: white;
    font-size: 35px;
    font-weight: normal;
    margin-bottom: 35px;
  }

  .energy_class_content {
    color: white;
    font-size: 28px;
    margin-left: 23px;
  }

</style>
